import Vue from 'vue';
import Router from 'vue-router';
import { getToken } from '@/utils/auth';

Vue.use(Router);

/* Layout */
import Layout from '@/layout';
import Personal from '@/layout/personal';
import Watemark from '@/utils/waterMark.js';
// import configuration from '@/layout/personal';
import myCenter from '@/layout/myCenter';

/**
 * 固定路由
 * the routes is base router
 */
export const constantRoutes = [
    // 登录
    {
        path: '/login',
        component: () =>
            import ('@/views/login/index'),
        hidden: true
    },
    // 登录
    {
        path: '/forgetpsd',
        component: () =>
            import ('@/views/login/forgetpsd'),
        hidden: true
    },
    // 重置密码
    {
        path: '/resetpwd',
        component: () =>
            import ('@/views/login/resetpwd'),
        hidden: true
    },
    // 设置 - 修改密码
    {
        path: '/Personal',
        component: myCenter,
        name: 'Personal',
        redirect: '/Personal/information',
        children: [{
            path: 'information',
            name: 'Information',
            component: () =>
                import ('@/views/login/information'),
            meta: { title: '个人中心', icon: 'user' }
        }]
    },
    {
        path: '/configuration',
        component: myCenter,
        name: 'configuration',
        redirect: '/configuration/configuration',
        children: [{
            path: 'configuration',
            name: 'Configuration',
            component: () =>
                import ('@/views/login/configuration'),
            meta: { title: '功能配置', icon: 'user' }
        }]
    },
    {
        path: '/esign',
        component: () =>
            import ('@/views/esign/index'),
        hidden: true
    }

];
/**
 * 动态路由
 * the routes that need to be dynamically loaded based on user roles
 */
export const asyncRoutes = [{

        path: '/archives',
        name: 'Archives',
        component: Layout,
        redirect: '/archives/formula/index',
        meta: { title: '档案', icon: 'archives' },
        children: [{
                path: '/archives/formula',
                name: 'Formula',
                component: Personal,
                meta: { title: '配方管理', icon: 'formula' },
                children: [{
                        path: '/archives/formula',
                        name: 'formula',
                        component: () =>
                            import ('@/views/archives/formula'),
                        meta: {
                            title: '配方管理',
                            icon: ''
                        }
                    },
                    {
                        path: '/archives/formula/detail',
                        name: 'FormulaDetail',
                        component: () =>
                            import ('@/views/archives/formula/detail'),
                        meta: {
                            title: '配方',
                            icon: ''
                        }
                    }

                ]
            },

            {
                path: '/archives/formulaHistory',
                name: 'FormulaHistory',
                component: Personal,
                meta: { title: '配方历史', icon: 'formulaHistory' },
                children: [{
                        path: '/archives/formulaHistory',
                        name: 'FormulaHistory',
                        component: () =>
                            import ('@/views/archives/formulaHistory'),
                        meta: {
                            title: '配方历史',
                            icon: ''
                        }
                    },
                    {
                        path: '/archives/formulaHistory/detail',
                        name: 'FormulaHistoryDetail',
                        component: () =>
                            import ('@/views/archives/formulaHistory/detail'),
                        meta: {
                            title: '配方',
                            icon: ''
                        }
                    }

                ]
            }

        ]
    },
    {
      path: '/jurisdiction',
      name: 'Jurisdiction',
      component: Layout,
      redirect: '/jurisdiction/account',
      meta: { title: '权限', icon: 'jurisdiction', code: '001007' },
      children: [{
        path: '/jurisdiction/account',
        name: 'Account',
        component: Personal,
        meta: { title: '账号管理', icon: 'account', code: '001007013' },
        redirect: '/jurisdiction/account',
        children: [{
          path: '/jurisdiction/account',
          name: 'Account',
          component: () =>
            import ('@/views/jurisdiction/account/index'),
          meta: {
            title: '账号管理',
            icon: ''
          }
        },
          {
            path: '/jurisdiction/account/detail',
            name: 'AccountDetail',
            component: () =>
              import ('@/views/jurisdiction/account/detail'),
            meta: {
              title: '账号',
              icon: ''
            }
          }

        ]

      },
        {
          path: '/jurisdiction/role',
          name: 'Role',
          component: Personal,
          meta: { title: '角色管理', icon: 'role', code: '001007012' },
          children: [{
            path: '/jurisdiction/role',
            name: 'Role',
            component: () =>
              import ('@/views/jurisdiction/role/index'),
            meta: {
              title: '角色管理',
              icon: ''
            }
          },
            {
              path: '/jurisdiction/role/detail',
              name: 'RoleDetail',
              component: () =>
                import ('@/views/jurisdiction/role/detail'),
              meta: {
                title: '角色',
                icon: ''
              }
            }

          ]

        },
        {
          path: '/jurisdiction/personnel',
          name: 'Personnel',
          component: Personal,
          meta: { title: '人员档案', icon: 'personnel', code: '001007008' },
          children: [{
            path: '/jurisdiction/personnel',
            name: 'Personnel',
            component: () =>
              import ('@/views/jurisdiction/personnel'),
            meta: {
              title: '人员档案',
              icon: ''
            }
          },
            {
              path: '/jurisdiction/personnel/detail',
              name: 'PersonnelDetail',
              component: () =>
                import ('@/views/jurisdiction/personnel/detail'),
              meta: {
                title: '人员',
                icon: ''
              }
            }

          ]

        }

      ]
}

];
/**
 * 重定向路由
 */
export const redirectRoutes = [
    // 404
    {
        path: '/404',
        component: () =>
            import ('@/views/404'),
        hidden: true
    },
    // 404 page must be placed at the end !!!
    {
        path: '*',
        redirect: '/404',
        hidden: true
    }
];
// 创建路由
const createRouter = () => new Router({
    // mode: 'history', // require service support
    scrollBehavior: () => ({
        y: 0
    }),
    // routes: [...constantRoutes, ...asyncRoutes, ...redirectRoutes]
    routes: constantRoutes
});
// 重置路由
export function resetRouter() {
    const newRouter = createRouter();
    router.matcher = newRouter.matcher; // reset router
}
const router = createRouter();
// 解决Loading chunk (\d)+ failed问题
router.onError((error) => {
    const pattern = /Loading chunk (\d)+ failed/g;
    const isChunkLoadFailed = error.message.match(pattern);
    if (isChunkLoadFailed) {
        // 用路由的replace方法，并没有相当于F5刷新页面，失败的js文件并没有从新请求，会导致一直尝试replace页面导致死循环，而用 location.reload 方法，相当于触发F5刷新页面，虽然用户体验上来说会有刷新加载察觉，但不会导致页面卡死及死循环，从而曲线救国解决该问题
        location.reload();
        // const targetPath = $router.history.pending.fullPath;
        // $router.replace(targetPath);
    }
});

export default router;
const outWatermark = (id) => {
    if (document.getElementById(id) !== null) {
        const div = document.getElementById(id);
        div.style.display = 'none';
    }
};

router.afterEach((to) => {
    if (to.path == '/') {
        Watemark.out(); // 清除水印
    } else {
        Watemark.set(getToken('userName') ? getToken('userName') + '' + getToken('userTel') : ''); // 设置水印title
    }
});
